<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <link rel="stylesheet" href="../../layui/css/layui.css">
</head>

<body>
  <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
    <legend>历史回放</legend>
  </fieldset>
  <form class="layui-form" action="" lay-filter="example">

    <div class="layui-form-item" style="margin-left: 90px;">
      <label class="layui-form-label" style=" width: auto;">历史回放的时间范围</label>
      <div class="layui-input-block">

      </div>
    </div>

    <div class="layui-form-item">
      <div class="layui-input-block" style="margin-left: 15px;">
        <input type="text" id="beg" name="beg" lay-verify="title" autocomplete="off" class="layui-input"
          style="width:160px; display:inline-block" value="2015-04-05 19:45:35" disabled="true">
        <input type="text" id="ends" name="ends" lay-verify="title" autocomplete="off" class="layui-input"
          style="width:160px; display:inline-block" value="2015-04-07 19:45:35" disabled="true">
      </div>
    </div>

    <div class="layui-form-item">
      <label class="layui-form-label" style=" width: auto;">历史开始时间</label>
      <div class="layui-input-block">
        <input type="text" id="begyear" name="begyear" lay-verify="begyear" autocomplete="off" placeholder="请输入值"
          class="layui-input" style="width:160px;display:inline;">-
        <input type="text" id="begtime" name="begtime" lay-verify="begtime" autocomplete="off" placeholder="请输入值"
          class="layui-input" style="width:160px;display:inline;">
      </div>

    </div>

    <div class="layui-form-item">
      <label class="layui-form-label" style=" width: auto;">历史结束时间</label>
      <div class="layui-input-block">
        <input type="text" id="endyear" name="endyear" lay-verify="endyear" autocomplete="off" placeholder="请输入值"
          class="layui-input" style="width:160px;display: inline;">-
        <input type="text" id="endtime" name="endtime" lay-verify="endtime" autocomplete="off" placeholder="请输入值"
          class="layui-input" style="width:160px;display: inline;">
      </div>
    </div>
  </form>

</body>
<script type="text/javascript" src="../../layui/layui.js"></script>
<script type="text/javascript" src="../../jquery-3.0.0.min.js"></script>
<script type="text/javascript" src="../Timejs/history.js"></script>
<script type="text/javascript">
  // var $;
  // var from;
  // var ids = 0;
  // layui.use(['form', 'laydate', 'layer'], function () {
  //   $ = layui.$;
  //   from = layui.form;
  //   var layer = layui.layer;
  //   var laydate = layui.laydate;
  //   laydate.render({
  //     elem: '#begyear',
  //   })
  //   laydate.render({
  //     elem: '#begtime',
  //     type: 'time'
  //   })
  //   laydate.render({
  //     elem: "#endyear",
  //   })
  //   laydate.render({
  //     elem: "#endtime",
  //     type: 'time'
  //   })
  //   $("#begin").blur(function () {
  //     var beg = $("#beg").val();
  //     var begin = $("#begin").val();
  //     if (begin < beg) {
  //       layer.tips('超出历史回放的范围', "#begin")
  //     }
  //   })
  //   $("#end").blur(function () {
  //     var ends = $("#ends").val();
  //     var end = $("#end").val();
  //     console.log(end)
  //     if (end < ends) {
  //       layer.tips('超出历史回放的范围', "#end")
  //     }
  //   })


  // })


  // function child(num2) {
  //   let year = num2.substr(0, 8)
  //   let time = num2.substr(8);
  //   let year1 = JSON.parse(year.substr(0, 4));//年
  //   let month1 = parseInt(year.substr(4, 2));//月
  //   let day1 = parseInt(year.substr(6, 2));//日
  //   var theTime = parseInt(time);// 秒
  //   if (theTime > 60) {
  //     middle = Math.floor(theTime / 60);
  //     theTime = (theTime % 60);
  //     if (middle > 60) {
  //       hour = Math.floor(middle / 60);
  //       middle = (middle % 60);
  //       if (hour > 24) {
  //         day = Math.floor(hour / 24);
  //         hour = (hour % 60);
  //         hour = hour - (day * 24)
  //       }
  //     }
  //   }
  //   var result = "" + (theTime);
  //   if (middle > 0) {
  //     result = "" + (middle) + ":" + result;
  //   }
  //   if (hour > 0) {
  //     result = "" + (hour) + ":" + result;
  //   }
  //   var offset = new Date().getTimezoneOffset() * 60 * 1000;
  //   var gmtdate = new Date(year1, month1, day1, hour, middle, theTime).getTime();
  //   var date = new Date(gmtdate - offset);
  //   var months;
  //   if (date.getMonth() == 0) {
  //     months = 12
  //   } else {
  //     months = date.getMonth();
  //   }

  //   var st = date.getFullYear() + "-" + months + "-" + date.getDate() + " " + date.getHours() + ":" + date.getMinutes() + ":" + date.getSeconds();
  //   $("#ends").val(st);
  // }
  // var retdata = function () {
  //   let begyear = $("#begyear").val();
  //   let begtime = $("#begtime").val();
  //   let endyear = $("#endyear").val();
  //   let endtime = $("#endtime").val();
  //   if (begyear == "" || begtime == "" || endyear == "" || endtime == "") {
  //     return false;
  //   } else {
  //     begyear = begyear.replace("-", "/");
  //     endyear = endyear.replace("-", "/");
  //     begyear = begyear.replace("-", "/");
  //     endyear = endyear.replace("-", "/");
  //     let begmin = new Date(begyear + " " + begtime);
  //     let begmax = new Date(endyear + " " + endtime);
  //     if (begmin > begmax) {
  //       return false;
  //     }
  //     var date = { begin: begyear + " " + begtime, end: endyear + " " + endtime };
  //     return date;
  //   }
  // }
</script>

</html>